<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity4">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>欢迎登陆</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css">
    <link rel="stylesheet" href="../../static/css/me.css" th:href="@{/css/me.css}">
</head>
<body>
    <!--导航-->
    <!--inverted:反色、attached:没有圆角，依附在上面:m-padded-tb-mini:m自己定义,padded,上下之间内部间隔,tb上下,mini小点-->
    <!--m-shadow-small:自定义导航阴影-->
    <!--导航-->
    <nav class="ui m-bg attached segment m-padded-tb-mini m-shadow-small animated fadeInDown" >
        <div class="ui container">
            <div class="ui secondary stackable menu">
                <h2 class="ui purple header item">后台管理</h2>
                <a href="#" th:href="@{/manager/index}" class="active m-item item m-mobile-hide m-black"><i class=" user secret icon"></i>欢迎页</a>
                <a href="#" th:href="@{/admin/students}" class="m-item item m-mobile-hide m-black"><i class="user secret icon"></i>用户信息</a>
                <a href="#" th:href="@{/admin/admins}" class="active m-item item m-mobile-hide m-black"><i class="user secret icon"></i>员工信息</a>
<!--                <a href="#" th:href="@{/admin/books}" class="m-item item m-mobile-hide m-black"><i class="users secret icon"></i>图书信息</a>-->
<!--                <a href="#" th:href="@{/admin/shelf}" class="m-item item m-mobile-hide m-black"><i class="users secret icon"></i>书架信息</a>-->
<!--                <a href="#" th:href="@{/admin/borrow}" class="m-item item m-mobile-hide m-black"><i class="users secret icon"></i>借阅记录</a>-->
                <div class="right m-item m-mobile-hide menu">
                    <div class="ui dropdown  item">
                        <div class="text">
                            <!--登录之后获取用户名-->
                            <div sec:authorize="isAuthenticated()">
                                <p>用户名:<span sec:authentication="name"></span></p>
                                <p>权限:<span sec:authentication="principal.authorities"></span></p>
                            </div>
                        </div>
                        <i class="dropdown icon"></i>
                        <div class="menu">
                            <a href="#" th:href="@{/admin/logout}" class="item">注销</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <a href="#" class="ui menu toggle black icon button m-right-top m-mobile-show">
            <i class="sidebar icon"></i>
        </a>
    </nav>

    <!--中间内容-->
    <div class="m-container-small m-padded-tb-big">
        <div class="ui container">
            <div class="ui success large  message">
                <h3 style="color: purple">Hi,</h3>
                <p style="color: purple">欢迎登录后台管理系统！</p>
            </div>

            <img src="/image/index.jpg" th:src="@{/image/index.jpg}" alt="" class="ui rounded bordered fluid image" style="width: 100%;height: 600px">
        </div>
    </div>

    <script src="https://cdn.jsdelivr.net/npm/jquery@3.2/dist/jquery.min.js"></script>
    <script src="https://cdn.jsdelivr.net/semantic-ui/2.2.4/semantic.min.js"></script>

    <script>
        $('.menu.toggle').click(function () {
            $('.m-item').toggleClass('m-mobile-hide');
        });

        $('.ui.dropdown').dropdown({
            on: 'hover'
        });

    </script>
    <script src="../../static/js/colourBar.js" th:src="@{/js/colourBar.js}" tppabs="../../static/js/colourBar.js"></script>
</body>
</html>